@import "../../base/fn";
.introduce_detail {
    padding-bottom: 3rem;         
    .image{        
        >img {
            display: block;
        }
        .consume{
            height: 5rem;
            background: url(../../../static/img/sales/Redesign/w_03.png) no-repeat; 
            background-size: 100% 100%;           
            display: flex;
            align-items: center;
            justify-content: center;
            .consume1{
                width: 33.3%;
                p{
                    font-size: 1.4rem;
                    color: #faecc5;
                    text-align: center;
                }
                h6{                    
                    font-size: .7rem;
                    color: #faecc5;
                    font-weight: 400;
                    text-align: center;
                }                
            }
        }
        .know{            
            position: relative;
            .know1{
                position: absolute;
                top: 20px;
                left: 0;
                width: 100%;
                height: 3rem;                                
            }
            .know2{
                position: absolute;
                bottom: 20px;
                left: 0;
                width: 100%;
                height: 4.2rem;                                
            }
        }
    }
    .image2{
        display: flex;
        flex-direction: column;
        align-items: center;                
    }
    >h2{                
        font-weight: 900;
        color: #6a5c4f;
        padding-left: .73rem;   
        margin-bottom: 10px;     
    }
    .goods_lists{
        width: 94%;
        margin: -14px auto 0 auto;
        padding-bottom: .8rem;
        background: #fff;        
        display: flex;
        flex-wrap: wrap;
        .goods_list{
            width: 50%;
            display: flex;
            flex-direction: column;                                                      
            h5{
                font-size: .7rem;
                color: #373737;
                padding: 0 .6rem;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
            }
            .member{
                font-size: 1rem;
                color: #000;
                display: flex;
                align-items: center;
                margin: .76rem 0 .29rem 0;
                padding: 0 .6rem;                
                p{
                    width: 3.8rem;
                    height: 1.2rem;
                    line-height: 1.2rem;
                    background: #2e3e57;
                    font-size: .8rem;                   
                    color: #fff;      
                    text-align: center;              
                }                
            }
            .non_member{
                font-size: 1rem;
                color: #fa0000;
                padding: 0 .6rem;
                span{
                    font-size: .64rem;
                    color: #939393;
                }
            }
        }        
    }
    .show_more{
        width: 94%;
        margin: 0 auto;                
        background: #fff;
        border-radius: 0 0 10px 10px;
        line-height: 2.73rem;
        font-size: .81rem;
        color: #9b9b9b;
        text-align: center;
        position: relative;
        &:after{
            .setTopLine(#cbcbcb)
        }          
    }
    .lists,.vip_lists{
        width: 94%;
        margin: 0 auto; 
        background: #fff;
        .list,.vip_list {            
            margin: 0 auto;
            position: relative;
            display: flex;
            align-items: center;            
            padding: .99rem .64rem;  
            &:after{
                .setTopLine(#cbcbcb)
            }                                
            >img{                                
                width: 8.4rem;
            }
            .text{
                flex: 1;
                margin-left: 12px;
                >h5{
                    font-size: 1.04rem;                                       
                }
                >p{                    
                    font-size: .81rem;                        
                    overflow: hidden;
                    text-overflow: ellipsis; 
                    display: -webkit-box;
                    -webkit-line-clamp: 1;
                    -webkit-box-orient: vertical;                 
                }
                >h6{
                    font-size: .81rem;  
                }
            }
            .text>h6:nth-of-type(1) {
                margin-top: 15px;
            }
        }
        .vip_list{
            .text{
                position: relative;
                h6{
                    font-weight: 400;
                    color: #f06a13;
                }
                .btns{                    
                    padding: .2rem .3rem;
                    margin-top: 1.5rem;
                    display: flex;
                    align-items: center;                    
                    background: #ff0e53;
                    border-radius: 20px;
                    img{
                        height: .8rem;
                        margin-right: .1rem;
                    }
                    h5{
                        font-size: .7rem;
                        color: #fff;
                    }
                }
            }
        }        
    }    
}


